<extend name="Public/base"/>

<block name="body">
    <link rel="stylesheet" type="text/css" href="__CSS__/index.css">
    <link rel="stylesheet" type="text/css" href="__CSS__/upload.css">
    <script type="text/javascript" src="__STATIC__/uploadify/jquery.uploadify.min.js"></script>
    <link href="__STATIC__/datetimepicker/css/datetimepicker.css" rel="stylesheet" type="text/css">
    <php>if(C('COLOR_STYLE')=='blue_color') echo '<link href="__STATIC__/datetimepicker/css/datetimepicker_blue.css" rel="stylesheet" type="text/css">';</php>
    <link href="__STATIC__/datetimepicker/css/dropdown.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="__STATIC__/datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
    <script type="text/javascript" src="__STATIC__/datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js" charset="UTF-8"></script>

    <div class="main-title">
        <h2>{$meta_title}</h2>
    </div>
    <form action="" method="post" class="form-horizontal">
        <input type="hidden" name="id" id="id" value="{$data['post_id']}">
        <div class="form-item">
            <label class="item-label">帖子标题<span class="check-tips"></span></label>
            <div class="controls">
                <input type="text" class="text input-large" id="post-title" name="title" value="{$data['title']}" placeholder="请输入帖子标题">
            </div>
        </div>
        <div class="form-item">
            <label class="item-label">帖子图片</label><span class="check-tips"></span>
            <div class="controls">

                <div class="img-box full">
                    <section class=" img-section">
                        <!--<p class="up-p">作品图片：<span class="up-span">最多可以上传5张图片，马上上传</span></p>-->
                        <div class="z_photo upimg-div clear" >
                            <?php if(!empty($data)):?>
                            <volist name="data.image_list" id="vo">
                                <section class="up-section fl">
                                    <span class="up-span"></span>
                                    <img src="__PUBLIC__/Admin/images/a7.png" class="close-upimg">
                                    <img src="__ROOT__{$vo}" class="up-img">
                                    <p class="img-namep"></p>
                                    <input id="taglocation" name="taglocation" value="" type="hidden">
                                    <input id="tags" name="tags" value="" type="hidden">
                                    <input type='hidden' name='image_list[]' value="{$vo}" class='img-item img-url js-pic_urlfile' >
                                </section>
                            </volist>
                            <?php endif;?>
                            <section class="z_file fl" style="<?php if($data['img_count']>=9){echo "display: none;";}?>">

                                     <img src="__PUBLIC__/Admin/images/a11.png" class="add-img">

                                                                                  <input type="file" name="file" id="file" class="file" value="" accept="image/jpg,image/jpeg,image/png,image/bmp" multiple />
                                                                              </section>
                            </div>
                        </section>
                    </div>
                    <aside class="mask works-mask">
                        <div class="mask-content">
                            <p class="del-p">您确定要删除图片吗？</p>
                            <p class="check-p"><span class="del-com wsdel-ok">确定</span><span class="wsdel-no">取消</span></p>
                        </div>
                    </aside>
                </div>
            </div>

            <div class="form-item">
                <label class="item-label">帖子正文<span class="check-tips"></span></label>
                <div class="controls">
                    <textarea rows="5" cols="20" id="content" class="text input-large kind-editor"  name="content" >{$data['content']}</textarea>
                </div>
            </div>
            <div class="form-item">
                <button class="btn submit-btn ajax-post" id="submit" type="submit" target-form="form-horizontal">确 定</button>
                <button class="btn btn-return" onclick="javascript:history.back(-1);return false;">返 回</button>
            </div>
        </form>
    </block>

    <block name="script">
        <script type="text/javascript">
            //导航高亮
            highlight_subnav('{:U('Post / systemPost')}');


        </script>

        <link rel="stylesheet" href="__PUBLIC__/static/kindeditor/default/default.css" />
        <script charset="utf-8" src="__PUBLIC__/static/kindeditor/kindeditor-min.js"></script>
        <script charset="utf-8" src="__PUBLIC__/static/kindeditor/zh_CN.js"></script>

        <script type="text/javascript">

            KindEditor.ready(function (K) {
                window.editor = K.create('textarea[class="kind-editor"]', {
                    //allowFileManager : false
                    minWidth: 900,
                    minHeight: 300,

                    afterBlur: function () {
                        this.sync();
                    },
                });
            });

        </script>
        <script type="text/javascript">
            $(function () {
                var maxupload = 9;
                var delParent;
                var defaults = {
                    fileType: ["jpg", "png", "bmp", "jpeg"], // 上传文件的类型
                    fileSize: 1024 * 1024 * 10                  // 上传文件的大小 10M
                };
                /*点击图片的文本框*/
                $(".file").change(function () {
                    var idFile = $(this).attr("id");
                    var file = document.getElementById(idFile);

                    var imgContainer = $(this).parents(".z_photo"); //存放图片的父亲元素
                    var fileList = file.files; //获取的图片文件

                    var input = $(this).parent();//文本框的父亲元素
                    var imgArr = [];
                    //遍历得到的图片文件
                    var numUp = imgContainer.find(".up-section").length;
                    var totalNum = numUp + fileList.length;  //总的数量
                    if (fileList.length > maxupload || totalNum > maxupload) {
                        alert("上传图片数目不可以超过" + maxupload + "个，请重新选择");  //一次选择上传超过5个 或者是已经上传和这次上传的到的总数也不可以超过5个
                    } else if (numUp < maxupload) {

                        fileList = validateUp(fileList);
                        for (var i = 0; i < fileList.length; i++) {
                            var filedata = fileList[i];
                            console.log(filedata);
                            var imgUrl = window.URL.createObjectURL(fileList[i]);
                            imgArr.push(imgUrl);
                            var $section = $("<section class='up-section fl loading'>");
                            imgContainer.prepend($section);
                            var $span = $("<span class='up-span'>");
                            $span.appendTo($section);

                            var $img0 = $("<img class='close-upimg'>").on("click", function (event) {
                                event.preventDefault();
                                event.stopPropagation();
                                $(".works-mask").show();
                                delParent = $(this).parent();
                            });
                            $img0.attr("src", "__PUBLIC__/Admin/images/a7.png").appendTo($section);
                            var $img = $("<img class='up-img up-opcity'>");
                            $img.attr("src", imgArr[i]);
                            $img.appendTo($section);

                            var formData = new FormData();
                            formData.append("download", filedata);
                            $.ajax({
                                url: "{:U('File/uploadImage')}",
                                type: "POST",
                                data: formData,
                                /**
                                 *必须false才会自动加上正确的Content-Type
                                 */
                                contentType: false,
                                /**
                                 * 必须false才会避开jQuery对 formdata 的默认处理
                                 * XMLHttpRequest会对 formdata 进行正确的处理
                                 */
                                processData: false,
                                success: function (data) {
                                    var $imginput = $("<input type='hidden' class='img-item' name='image_list[]'>");
                                    $imginput.val(data.path);
                                    $imginput.appendTo($section);

                                },
                                error: function () {
                                    alert("上传失败！");
                                    //                                $("#imgWait").hide();
                                }
                            });
                            var $p = $("<p class='img-name-p'>");
                            $p.html(fileList[i].name).appendTo($section);
                            var $input = $("<input id='taglocation' name='taglocation' value='' type='hidden'>");
                            $input.appendTo($section);
                            var $input2 = $("<input id='tags' name='tags' value='' type='hidden'/>");
                            $input2.appendTo($section);

                        }
                    }
                    setTimeout(function () {
                        $(".up-section").removeClass("loading");
                        $(".up-img").removeClass("up-opcity");
                    }, 450);
                    numUp = imgContainer.find(".up-section").length;
                    if (numUp >= maxupload) {
                        $(this).parent().hide();
                    }

                    //input内容清空
                    $(this).val("");
                });



                $(".z_photo").delegate(".close-upimg", "click", function () {
                    $(".works-mask").show();
                    delParent = $(this).parent();
                });

                $(".wsdel-ok").click(function () {
                    $(".works-mask").hide();
                    var numUp = delParent.siblings().length;
                    if (numUp < maxupload + 1) {
                        delParent.parent().find(".z_file").show();
                    }
                    delParent.remove();

                });

                $(".wsdel-no").click(function () {
                    $(".works-mask").hide();
                });

                function validateUp(files) {
                    var arrFiles = [];//替换的文件数组
                    for (var i = 0, file; file = files[i]; i++) {
                        //获取文件上传的后缀名
                        var newStr = file.name.split("").reverse().join("");
                        if (newStr.split(".")[0] != null) {
                            var type = newStr.split(".")[0].split("").reverse().join("");
                            console.log(type + "===type===");
                            if (jQuery.inArray(type, defaults.fileType) > -1) {
                                // 类型符合，可以上传
                                if (file.size >= defaults.fileSize) {
                                    alert(file.size);
                                    alert('您这个"' + file.name + '"文件大小过大');
                                } else {
                                    // 在这里需要判断当前所有文件中
                                    arrFiles.push(file);
                                }
                            } else {
                                alert('您这个"' + file.name + '"上传类型不符合');
                            }
                        } else {
                            alert('您这个"' + file.name + '"没有类型, 无法识别');
                        }
                    }
                    return arrFiles;
                }

            });
        </script>
    </block>
